<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="author" content="lzy">
    <title>lzy-</title>
    <script src="js/jquery-3.1.1.js"></script>
    <style>
        div{
            width: 520px;
            height: 280px;
            margin: 100px auto;
            position: relative;
        }
        img{
            width: 100%;
            height: 100%;
            position: absolute;
            display: none;
        }
        .active{
            display: block;
        }
    </style>
</head>
<body>
    <div>
        <img src="img/01.jpg" alt="" class="active">
        <img src="img/02.jpg" alt="">
        <img src="img/03.jpg" alt="">
        <img src="img/04.jpg" alt="">
        <img src="img/05.jpg" alt="">
    </div>
</body>
</html>
<script>
    var current=1;
    function play(){
        $('img').eq(current).css('display','block');
        $('img').eq(current).siblings().css('display','none');
        current ++;
        if(current==5){
            current=0;
        }
    }
    setInterval(play,1000);
</script>